<template>
	<view class="introWrap">
		<view class="introTit">优惠券使用说明</view>
		<view class="introCon">
			<scroll-view class="scrollView" scroll-y>
				<view class="item">
					<view class="conTit">Q1.什么是优惠券</view>
					<view class="con">优惠券由和心云官方发行，在平台进行相应的产品或服务消费时，可实际抵扣支付；</view>
				</view>
				<view class="item">
					<view class="conTit">Q2.注意事项</view>
					<view class="con">一、每个订单只能使用一张优惠券；</view>
					<view class="con">二、优惠券均不可找零、不可兑现；</view>
					<view class="con">三、订单取消后，原占用优惠券会自动返还；</view>
				</view>
				<view class="item">
					<view class="conTit">Q3.为什么当前的优惠券不可使用</view>
					<view class="con">一、当前方案下已选择了优惠活动，该优惠活动与优惠券不可叠加使用；</view>
					<view class="con">二、优惠券门槛金额应小于当前实付金额方可使用；</view>
				</view>
			</scroll-view>
		</view>
		<view class="introBot">
			<view class="botBtn" @tap="closeYhqIntro">我知道了</view>
		</view>
	</view>
</template>

<script>
	export default {
		methods:{
			closeYhqIntro(){
				this.$emit('closeYhqIntro');
			}
		}
	}
</script>

<style lang="scss" scoped>
	.introWrap{
		width: 600rpx;
		height: 720rpx;
		background: #fff;
		border-radius: 15rpx;
		.introTit{
			height: 100rpx;
			line-height: 100rpx;
			font-size: 32rpx;
			color: $pss-text-color3;
			font-weight: bold;
			text-align: center;
		}
		.introCon{
			margin: 0 20rpx;
			height: 520rpx;
			.scrollView{
				height: 100%;
				color: $pss-text-color3;
			}
			.item{
				margin-bottom: 30rpx;
			}
			.conTit{
				font-size: 30rpx;
				font-weight: bold;
				line-height: 60rpx;
			}
			.con{
				font-size: 28rpx;
			}
		}
		.introBot{
			height: 100rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			.botBtn{
				height: 60rpx;
				line-height: 60rpx;
				width: 260rpx;
				background: $pss-color-primary_1;
				color: #fff;
				text-align: center;
				font-size: 28rpx;
				border-radius: 50rpx;
			}
		}
	}
</style>